// 从 'vue' 包中导入 Vue 构造函数。这是使用 Vue 框架的起点。
import Vue from "vue";
// 导入根组件 App.vue。'.vue' 后缀在 webpack 配置中通常是可省略的（但仍推荐显式加上）。
import App from "./App.vue";

// Vue.config 是一个对象，包含 Vue 的全局配置。
// productionTip 设置为 false 可以阻止 Vue 在启动时生成生产提示。
// 在开发环境中，这可以减少控制台中的冗余信息。
Vue.config.productionTip = false;
// Vue.config.devtools = true; // 加了这个也不好使（默认本就是true），还是不显示vueDevTools

// 创建一个新的 Vue 实例，这是应用的根实例。
new Vue({
    // render 函数是 Vue 渲染组件的方式，比 template 选项更接近编译器。
    // h 是 createElement 的别名-社区约定，是一个函数，用于创建 VNode (虚拟 DOM 节点)。
    // h(App) 的意思是创建一个代表 App 组件的 VNode。
    // 当这个 Vue 实例被挂载时，Vue 会将这个 VNode 渲染成真实的 DOM。
    // 这是 Vue CLI 项目中使用的一种常见写法，功能上等同于：
    // template: '<App/>',
    // components: { App }
    render: (h) => h(App),

    // .$mount('#app') 是将 Vue 实例挂载到 DOM 元素上的方法。
    // '#app' 是一个 CSS 选择器，指向 public/index.html 文件中的 <div id="app"></div>。
    // 这行代码告诉 Vue：“请将我（这个 Vue 实例）渲染的内容，放到 id 为 'app' 的那个 DOM 元素里面去。”
}).$mount("#app");
